<template>
    <div class="layout-content" id="layout-content">
        <div class="layout-toolbar">
            <div class="layout-toolbar-inner">
                <div class="mod-nav clearfix">
                    <div title="" class="mod-action-wrap mod-action-wrap-a mod-action-wrap-upload clearfix" v-if="Bus.Batch.selectedData.length < 1" >
                        <a-button class="trash-btn" :disabled="trashLiat.length > 1" @click="trashAll">清空全部</a-button>
                    </div>
                    <div title="" class="trash mod-action-wrap mod-action-wrap-a mod-action-wrap-upload clearfix"  v-if="Bus.Batch.selectedData.length > 0">
                        <div class="mod-action-wrap-c">
                            <div style="display: inline-block;">
                                <div class="trash-action-item" style="display: inline-block;">
                                    <div class="action-item-con">
                                        <i class="icon icon-undo"></i>
                                        <span class="act-txt">还原</span>
                                    </div>
                                </div>
                                <div class="trash-action-item" style="display: inline-block;">
                                    <div class="action-item-con">
                                        <i class="icon icon-trash-xs"></i>
                                        <span class="act-txt">永久删除</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <MenuTopUser/>
                </div>
            </div>
        </div>

        <!--重命名-->
        <a-modal
                v-model="addDirModal"
                :closable="false"
                wrapClassName="edit_item_modal"
                :width="400"
        >
            <p class="title">重命名</p>
            <p class="input">

            </p>

            <template slot="footer">
                <a-button @click="addDirModal=false">取 消</a-button>
                <a-button htmlType="submit" type="primary" @click.stop.prevent="addItem">保 存</a-button>
            </template>
        </a-modal>

    </div>
</template>

<script>
    import ApiUrl from '../../config/api'
    import MenuTopUser from '../../components/MenuTop/User'
    export default {
        name: "top",
        components: {
            MenuTopUser,
        },
        data() {
            return {
                trashLiat: [],
                trashLoding: false,
                tempSelect: [],
                addDirModal: false
            }
        },
        watch: {
            '$route': 'pageLoad',
            selectedData (newVal, oldVal) {
                this.Bus.Batch.selectedData = newVal;
            },
        },
        methods: {
            trashAll() {
                this.$confirm({
                    title: '确定清空回收站吗?',
                    content: '清空后将无法找回删除的文件',
                    confirmLoading: this.trashLoding,
                    iconType: 'exclamation-circle',
                    wrapClassName: 'trashAllModal',
                    class: 'trashAllModal',
                    centered: true,
                    cancelText: '取消',
                    okText: '确定',
                    okType: 'danger',
                    onOk() {
                        return new Promise((resolve, reject) => {
                            setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
                        }).catch(() => console.log('Oops errors!'));
                    },
                    onCancel() {},
                });
            },
            handleNameValidate(rule, value, callback) {
                value = typeof value != "undefined" ? value : '';
                const regex = new RegExp("[:*?/\\\"<>|']", 'g');
                if(value == "" || value.replace(/^\s+|\s+$/g, '') == ''){
                    callback(new Error('请输入文件夹名称'));
                }else if(regex.test(value)){
                    callback(new Error('文件夹名称不能包含以下字符之一：:*?/"<>|\\'));
                }
                callback();
            },
            addItem() {
                this.addDirForm.validateFields((err, values) => {
                    if (!err) {
                        let dirId = typeof this.$route.params.dir_id == "undefined" ? '0':this.$route.params.dir_id;
                        let hide = this.$message.loading('正在创建...', 0);
                        this.addDirModal = false;
                        let Url = ApiUrl.DiskApiUrl.add;
                        this.$ajax.post(Url, {folder:values.name, pdir_id:dirId}, {}).then(function (ret) {
                            let dataS = ret.data;
                            this.$message.destroy();
                            if (dataS.code == 200) {
                                this.$message.success('创建成功');
                            } else {
                                let msg = dataS.msg || '创建失败';
                                this.$message.error(msg);
                            }
                            this.$emit("refreshBatch",false);
                            setTimeout(function () {
                                this.addDirForm.setFieldsValue({
                                    name: ''
                                });
                            }.bind(this),20)
                        }.bind(this));
                    }else{
                        // console.log('error',values);
                    }
                });
            },
        }
    }
</script>

<style scoped lang="less">
    @import "../../assets/css/right.less";
</style>
<style lang="less">
    .trash-btn.ant-btn{
        height: 34px;
        padding: 0 13px;
    }
    .trashAllModal {
        .ant-modal-confirm-confirm {
            .ant-modal-confirm-body > .antico{
                color: #FE4222;
            }
        }
    }
</style>